import React from "react";
import instance from "../../api/instance";
import { useNavigate } from "react-router-dom";
import {
  Form,
  Input,
  Button,
  Dialog,
  TextArea,
  DatePicker,
  Selector,
  Slider,
  Stepper,
  Switch,
} from "antd-mobile";
function Index() {
  let nav = useNavigate()
  const onFinish = async (value)=>{
    const res = await instance.post('/api/login',value)
    let {data,code} = res.data
    console.log(res.data)
    if(code == 200){
      localStorage.setItem('token',data.token)
      localStorage.setItem('pic',data.userInfo.avatar)
      localStorage.setItem('user',data.userInfo.nickname)
      nav('/')
    }
  }
  return (
    <div>
      <Form
        onFinish={onFinish}
        layout="horizontal"
        footer={
          <Button block type="submit" color="primary" size="large">
            登录
          </Button>
        }
      >
        <Form.Header>登录页面</Form.Header>
        <Form.Item
          name="username"
          label="账号"
          rules={[{ required: true, message: "账号不能为空" }]}
        >
          <Input placeholder="请输入账号" />
        </Form.Item>
        <Form.Item
          name="password"
          label="密码"
          rules={[{ required: true, message: "密码不能为空" }]}
        >
          <Input placeholder="请输入密码" />
        </Form.Item>
      </Form>
    </div>
  );
}

export default Index;
